<script >
export default {
  name: 'banner_component',
  methods: {
    back() {
      this.$router.back();
    },
    forward() {
      this.$router.forward();
    },
    back3() {
      this.$router.go(-3);
    },
    forward3() {
      this.$router.go(3); }
  },
}
</script>

<template>
  <div>
    <h2>Vue Router Demo</h2>
    <button type="button" class="btn btn-primary" @click="back">返回</button>
    <button type="button" class="btn btn-primary" @click="forward">前进</button>
    <button type="button" class="btn btn-primary" @click="back3">后退3步</button>
    <button type="button" class="btn btn-primary" @click="forward3">前进3步</button>
  </div>
</template>

<style scoped>
button {
  margin: 2px;
}
</style>